<style type="text/css">
    .plupload_container {
        max-height:200px;
        max-width: 500px;
        position: relative;
    }
</style>
<div id="product-class-detail" class="modal fade">
    <div class="modal-dialog modal-lg" >
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">添加分类</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                <form id="product-class-form" action='{:U("Admin/Product/updateProductClass")}' method="post">
                <div class="form-group">
                    <div class="col-sm-12">
                        <div class="col-sm-1"></div>
                        <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
                            <label for="name" class="control-label">分类名称：</label>
                        </div>
                        <div class="col-sm-6">
                            <input id="product_class_id" name="product_class_id" class="form-control" style="display:none;"></input>
                            <input id="name" name="name" class="form-control"></input>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <br>
                        <div class="col-sm-1"></div>
                        <div class="col-sm-3" style="padding-top:5px">
                            <label for="parent_id" class="control-label">上级分类：</label>
                        </div>
                        <div class="col-sm-6">
                            <ul id="parent_id_tree" class="ztree"></ul>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <br>
                        <div class="col-sm-1"></div>
                        <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
                            <label for="index" class="control-label">排序：</label>
                        </div>
                        <div class="col-sm-6">
                            <input id="index" name="index" class="form-control"></input>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <br>
                        <div class="col-sm-1"></div>
                        <div class="col-sm-3" style="padding-top:5px">
                            <label class="control-label">是否显示：</label>
                        </div>
                        <div class="col-sm-2">
                            <input id="display1" value="1" type="radio" name="display"></input><label for="display1" class="control-label">&nbsp;是</label>
                        </div>
                        <div class="col-sm-2">
                            <input id="display0" value="0" type="radio" name="display"></input><label label for="display0" class="control-label">&nbsp;否</label>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <br>
                        <div class="col-sm-1"></div>
                        <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
                            <label for="phone" class="control-label">导航栏：</label>
                        </div>
                        <div class="col-sm-2">
                            <input id="navbar1" value="1" type="radio" name="navbar"></input><label for="navbar1" class="control-label">&nbsp;是</label>
                        </div>
                        <div class="col-sm-2">
                            <input id="navbar0" value="0" type="radio" name="navbar"></input><label for="navbar0" class="control-label">&nbsp;否</label>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <br>
                        <div class="col-sm-1"></div>
                    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
                            <label class="control-label">分类图片：</label>
                            <br><br>
                            <span class="control-label">已上传的图片：</span>
                            <div id="img"></div>
                        </div>
                        <div class="col-sm-6">
                            <div id="uploadImg">
                            <p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <br>
                        <div class="col-sm-1"></div>
                        <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
                            <label for="descript" class="control-label">分类描述：</label>
                        </div>
                        <div class="col-sm-6">
                            <textarea id="descript" name="descript" class="form-control" style="height:100px"></textarea>
                        </div>
                    </div>
                    <br><br>
                </div>
                </form>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-primary" onclick="submit()">保存</button>
                <button class="btn btn-defalt" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>
<script>
$('#product-class-detail').on("hidden.bs.modal",function(e){
    var treeObj = $.fn.zTree.getZTreeObj("parent_id_tree");
    treeObj.cancelSelectedNode();
    $("input[name='product_class_id']").attr('value', '');
    $("input[name='name']").attr('value', '');
    $("input[name='index']").attr('value', '');
    $("textarea[name='descript']").html('');
    $('#img').html('');
    imgurl = '';
}); 
function submit(){
    var treeObj = $.fn.zTree.getZTreeObj("parent_id_tree");
    var nodes = treeObj.getSelectedNodes();

    if(nodes.length == 0){
        alert("请选择一个上级分类！");
        return;
    }
    var type = parseInt(nodes[0].type)+1;
    var parent_id = nodes[0].product_class_id;
    if(type == 1){
        parent_id = "0";
    }
    if(type > 3){
        alert("分类最小到第3级！请选择其他分类");
        return;
    }
   
    $('#product-class-form').ajaxSubmit({
        data: {
            'imgurl': imgurl,
            'parent_id': parent_id,
            'type': type,
        },
        success:function(data){
            $('#product-class-detail').modal('hide');
            //console.log(data);
            location.reload();
        }
    });
}

</script>